<template>
	<view>
		<!-- 头部 -->
		<view class="navbar">
			<u-icon @click="navigateBack" class="icon-left" name="arrow-left" color="#fff" size="50"></u-icon>
			<text>管理员</text>
		</view>
		<!-- 内容 -->
		<view class="section">
			<view class="info" v-for='(item,idx) in adminList' :key='idx'>
				<view class="">
					<image style="width: 120rpx;height: 120rpx;" :src="item.avatar" mode=""></image>
						<text class="information">{{array[Number(item. name)].name}} {{item.phone}}</text>
						<!-- <view class="" style='display:flex;align-items:center'> -->
								<text style="color: #445CDF;margin-left:8rpx">{{item.role==='0'?'管理员':''}} </text>
								<text style='margin-left:10rpx'  v-show='myPhone===item.phone'>（我）</text>
						<!-- </view> -->
					
					<!-- 	<image @click="edit(item)" style="width: 40rpx;height: 40rpx;float: right;" :src="item.avatar" mode=""></image> -->
						<u-icon @click="edit(item)"  style="width: 40rpx;height: 40rpx;float: right;" name="edit-pen"
							color="#FFD115" size="40">
							</u-icon>
				</view>
			
			</view>
			
	<!-- 		<view class="info">
				<image style="width: 120rpx;height: 120rpx;" src="https://srmzln.oss-cn-hangzhou.aliyuncs.com/znl/images/relationship.png" mode=""></image>
				<text class="information">爷爷 13296596210</text>
				<image @click="edit" style="width: 40rpx;height: 40rpx;float: right;" src="https://srmzln.oss-cn-hangzhou.aliyuncs.com/znl/images/edit.png" mode=""></image>
			</view>
			
			<view class="info">
				<image style="width: 120rpx;height: 120rpx;" src="https://srmzln.oss-cn-hangzhou.aliyuncs.com/znl/images/relationship.png" mode=""></image>
				<text class="information">奶奶 13296596210</text>
				<image @click="edit" style="width: 40rpx;height: 40rpx;float: right;" src="https://srmzln.oss-cn-hangzhou.aliyuncs.com/znl/images/edit.png" mode=""></image>
			</view> -->
			
				<view class="tips">
					<view>***</view>
					<text>添衣宝最多可绑定6位管理员。管理员可通过“添衣宝”小程序查看宝贝相关信息</text>
				</view>
				<view class="binding" @click="unbound"><text>邀请管理员</text></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				array: [{
					name: '爸爸'
				}, {
					name: '妈妈'
				}, {
					name: '爷爷'
				}, {
					name: '奶奶'
				}, {
					name: '外公'
				}, {
					name: '外婆'
				}, {
					name: '其他'
				}],
				adminList:[],
				myPhone:''
			}
		},
		mounted(){
			this.getAdmin()
			
		this.myPhone = uni.getStorageSync('zwxphone')
		},
		methods: {
			async getAdmin() {
			
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				let res = await this.$api.getAdminList();
			
				if (res.code == 200) {
					this.adminList = res.result.list
					if(this.adminList.length && this.adminList[0].device_code==='202212130100192'){
						const list = []
						this.adminList.forEach(ele=>{
							if(ele.role==='0' ||this.myPhone===ele.phone){
								list.push(ele)
							}
						})
						this.adminList = list
					}
				} else {
			
				}
				uni.hideLoading();
			
			},
			navigateBack(){
				uni.switchTab({
					url:'../my'
				})
			},
			edit(item){
				console.log(item,22)
				uni.navigateTo({
					url:`editAdmin/editAdmin?data=`+encodeURIComponent(JSON.stringify(item))
					
				})
			},
			unbound(){
				uni.navigateTo({
					url:'invitation/invitation'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	// 头部
	.navbar {padding-top: 90rpx;padding-bottom: 40rpx;width: 750rpx;color: #fff;background-color: rgb(68, 92, 223);}
	.navbar>text {font-size: 36rpx;padding-left: 220rpx;}
	
	// 内容
	.section{padding: 50rpx;background-color:rgb(247,247,247);}
	.section > .info{position: relative;border-radius: 10rpx;background-color: #fff;margin-bottom: 30rpx;padding: 20rpx;height: 160rpx;}
	.information{position: absolute;left: 25%;top:30%;font-size: 32rpx;font-weight: bold;}
	.tips{font-size: 24rpx;color: #999;}
	.tips > view{text-align: center;}
	.tips image:first-child{}
	.binding {
		box-shadow: 1px 1px 2px rgb(228, 227, 227), 0 0 5px rgb(228, 227, 227), 0 0 1px rgb(228, 227, 227);
		border-radius: 50rpx;text-align: center;margin-bottom: 35rpx;padding: 25rpx;font-size: 30rpx;
		background-color: rgb(68,92,223);color: #fff;margin-top: 100rpx;margin-bottom: 500rpx;
	}
</style>
